$(document).ready(function($){
	
	/* OBTENIENDO INFORMACION DE CADA AREA
	 * -----------------------------------
	 * */		
	app_control_ini(1,0);
	
	$("#sele-empr").live("change", function(){
		
		$("#sele-empr option:selected").each(function () {
			
			console.log($(this).text());
			console.log($(this).attr("value"));
			
			app_control_ini(2,$(this).attr("value"));
			
		});		
		
	});
	
	app_esquema_area_validacion();
	
});

$(window).resize(function(){
	
	
});

function app_esquema_area_validacion(){
	
	/* EN CASO QUE EL OBJETO JSON NO EXISTA EN EL LOCALSTORAGE
	 * -------------------------------------------------------
	 * El codigo lo re construira o consultara desde la base 
	 * de datos mientras esta informacion este disponible ahi
	 * */
	
	if(!localStorage.loc_usr_cfg){
		
		var ini_usr_cfg_ini = null;
		
		var dataString = {
			con_area : 0,
			nro_area : 0
		};
		
		var ini_est_cfg_ini = false;
		
		dataString = $.param(dataString);
		
		$.ajax({
			
			type: "POST",
			url: "../../esmeralda-services-maintenance/class/list-esquema/listenerArea.php",
			data: dataString,
			dataType: "json",        
			success: function(data) {
				
				console.log("consola: json - creando objeto");
				
				ini_usr_cfg_ini = {
					"panels": data.panels
				};
				
				console.log(ini_usr_cfg_ini);
				
				localStorage.loc_usr_cfg = JSON.stringify(ini_usr_cfg_ini);
				
				ini_est_cfg_ini = true;
				
			},
			complete: function(){
				
				if(ini_est_cfg_ini==true){
					
					console.log("consola: json - termino de crear objeto");
					console.log("consola: esquema - validado objeto json - creando esquema");
					
					app_esquema_area(0,17);					
					app_esquema_ini();
					
				}else{
					
					console.log("consola: json - no termino de crear objeto");
					
				}
				
			},
			error: function(){
				
				console.log("consola: json - error creando objeto");
				
				ini_est_cfg_ini = false;
				
			}
		
		});		
		
		console.log("consola: json - termino de crear objeto");
		console.log("consola: esquema - termino de crear esquema");
		
	}else{
		
		console.log("consola: esquema - ya existia objeto json - creando esquema");
		
		app_esquema_area(0,17);
		app_esquema_ini();
		
	}
	
}
function app_comprueba_esquema(con_comprobar, emp_comprobar){
	
	var dataString = {
		con_comprobar:con_comprobar,
		emp_comprobar:emp_comprobar
	};
	
	dataString = $.param(dataString);
	
	$.ajax({
			
		type: "POST",
		url: "../../esmeralda-services-maintenance/class/list-esquema/listenerComprobarEsquema.php",
		data: dataString,
		dataType: "json",        
		success: function(data) {
			
			console.log("consola: comprobacion - creando comprobacion");
			
		},
		complete: function(){
			
			console.log("consola: comprobacion - creando comprobacion - termino de crear comprobacion");
			
		},
		error: function(){
			
			console.log("consola: comprobacion - creando comprobacion - error durante la creacion");
			
		}
	
	});
	
}

function app_esquema_area(con_area, emp_area, nro_area){
	
	var dataString = {
		con_area:con_area,
		emp_area:emp_area,
		nro_area:nro_area
	};
	
	dataString = $.param(dataString);	
	/*var nro_con = "";*/	
	var panel = "";
	var panel_equipo = $("<tbody />");
	var panel_area_nro_unico = "";
	var panel_area_equipo_nro_unico = "";
	var panel_area_nombre_compuesto = "";
	
	var area_color = "";
	var area_posicion_left = "";
	var area_posicion_top = "";
	
	var usr_cfg_ini_pan = null;
	
	$.ajax({
		
		type: "POST",
		url: "../../esmeralda-services-maintenance/class/list-esquema/listenerAreaEquipo.php",
		data: dataString,
		dataType: "json",        
		success: function(data) {
			
			console.log("consola: esquema - creando esquema");			
			/*nro_con = data.esquema[0].area_empresa_nro_unico;*/
			panel_area_equipo_nro_unico = data.esquema[0].area_empresa_nro_unico;
			panel_area_nro_unico = data.esquema[0].area_nro_unico;
			panel_area_nombre_compuesto = data.esquema[0].area_empresa_nombre_compuesto;
			
			$.each(data.esquema, function(i, item){
				
				area_color = item.area_color;
				area_posicion_left = item.area_posicion_left;
				area_posicion_top = item.area_posicion_top;
				
				if(item.area_empresa_nro_unico == panel_area_equipo_nro_unico){

					/* EL AREA ES IGUAL: ACUMULAMOS LOS EQUIPOS PARA AGRUPARLOS POR AREA
					 * --------------------------------------------------------
					 * */
					console.log("consola: esquema - creando esquema - detectando equipos");
					
					panel_equipo.append(
						$("<tr />").append(
							$("<td />",{
								"id"	:	"equ-maq-" + item.equipo_nro_unico,
								"text"	:	item.equipo_descripcion.toLowerCase()
							}).add("<td />",{
								"id"	:	"equ-per-" + item.personal_nro_unico,
								"text"	:	item.personal_d_usuario_maquina.toLowerCase()
							}).add("<td />",{
								"id"	:	"equ-est-" + item.area_empresa_nro_unico,
								"text"	:	"ok"
							})
						)
					);
					
				}else{
					
					/* EL AREA ES DIFERENTE: ARMAMOS LA VISUALIZACION DEL PANEL
					 * --------------------------------------------------------
					 * */	
					
					usr_cfg_ini_pan = JSON.parse(localStorage.loc_usr_cfg);

					$.each(usr_cfg_ini_pan.panels,function(o,ubic) {
					
						if(ubic.id == panel_area_nro_unico) {
							
							area_color = ubic.color;
							area_posicion_left = ubic.position.left;
							area_posicion_top = ubic.position.top;
														
						}
					
					});		
					
					console.log("consola: esquema - creando esquema - creando paneles");
					
					panel =		$("<section />",{
									"id"	:	"panel-" + panel_area_equipo_nro_unico,
									"area"	:	"area-" + panel_area_nro_unico,
									"class"	:	"panel-area",
									"style"	:	"background-color:" + area_color + ";position:absolute; margin-top: " + area_posicion_top + "px; margin-left: " + area_posicion_left + "px"									
								}).append(
									$("<div />",{
										"class":"panel-head"
									}).append(
										$("<p />",{
											"text"	:	panel_area_nombre_compuesto
										})
									).add(
										$("<div />",{
											"class":"panel-body"
										}).append(
											$("<div />").append(
												$("<table />").append(
													$("<thead />").append(
														$("<tr />").append(
															$("<td />",{
																"text"	:	"equipos"
															}).add("<td />",{
																"text"	:	"usuarios"
															}).add("<td />",{
																"text"	:	"estado"
															})
														)
													).add(panel_equipo)
												)
											)
										).add(
											$("<div />",{
												"class":"panel-foot"
											}).append(
												$("<p />").append(
													$("<input />",{
														"id"	:	"chck-posi-panel-" + panel_area_equipo_nro_unico,
														"name"	:	"chck-posi-panel-" + panel_area_equipo_nro_unico,
														"type"	:	"checkbox"
													}).add("<label />",{
														"for"	:	"chck-posi-panel-" + panel_area_equipo_nro_unico,
														"text"	:	" organizar bloques"
													})
												).add(
													$("<p />").append(
														$("<span />",{
															"id"	:	"area-picker-panel-" + panel_area_equipo_nro_unico,
															"area"	:	"area-" + panel_area_nro_unico,
															"class"	:	"area-picker",
															"text"	:	" personalizar color"
														})
													)
												)
											)
										)
									)
								);
					
					
					
					$("#area-cont").append(panel);
					
					panel_equipo = $("<tbody />");
					
					panel_equipo.append(
						$("<tr />").append(
							$("<td />",{
								"id"	:	"equ-maq-" + item.equipo_nro_unico,
								"text"	:	item.equipo_descripcion.toLowerCase()
							}).add("<td />",{
								"id"	:	"equ-per-" + item.personal_nro_unico,
								"text"	:	item.personal_d_usuario_maquina.toLowerCase()
							}).add("<td />",{
								"id"	:	"equ-est-" + item.area_empresa_nro_unico,
								"text"	:	"ok"
							})
						)
					);
					
					panel = "";			
					
					
				}
				
				panel_area_nro_unico = item.area_nro_unico;
				panel_area_equipo_nro_unico = item.area_empresa_nro_unico;
				panel_area_nombre_compuesto = item.area_empresa_nombre_compuesto;				
				/*nro_con = item.area_empresa_nro_unico;*/				
			});
			
			/* ARMAMOS LA VISUALIZACION DEL PANEL -> YA QUE ES EL ULTIMO
			 * ---------------------------------------------------------
			 * */
			
			usr_cfg_ini_pan = JSON.parse(localStorage.loc_usr_cfg);
			
			$.each(usr_cfg_ini_pan.panels,function(o,ubic) {
				
				if(ubic.id == panel_area_nro_unico) {
					
					area_color = ubic.color;
					area_posicion_left = ubic.position.left;
					area_posicion_top = ubic.position.top;
												
				}
			
			});			
			
			console.log("consola: esquema - creando esquema - creando paneles (ultimo panel)");			
						
			panel =		$("<section />",{
							"id"	:	"panel-" + panel_area_equipo_nro_unico,
							"area"	:	"area-" + panel_area_nro_unico,
							"class"	:	"panel-area",
							"style"	:	"background-color: " + area_color + "; position: absolute; margin-top: " + area_posicion_top + "px; margin-left: " + area_posicion_left + "px"									
						}).append(
							$("<div />",{
								"class":"panel-head"
							}).append(
								$("<p />",{
									"text"	:	panel_area_nombre_compuesto
								})
							).add(
								$("<div />",{
									"class":"panel-body"
								}).append(
									$("<div />").append(
										$("<table />").append(
											$("<thead />").append(
												$("<tr />").append(
													$("<td />",{
														"text"	:	"equipos"
													}).add("<td />",{
														"text"	:	"usuarios"
													}).add("<td />",{
														"text"	:	"estado"
													})
												)
											).add(panel_equipo)
										)
									)
								).add(
									$("<div />",{
										"class":"panel-foot"
									}).append(
										$("<p />").append(
											$("<input />",{
												"id"	:	"chck-posi-panel-" + panel_area_equipo_nro_unico,
												"name"	:	"chck-posi-panel-" + panel_area_equipo_nro_unico,
												"type"	:	"checkbox"
											}).add("<label />",{
												"for"	:	"chck-posi-panel-" + panel_area_equipo_nro_unico,
												"text"	:	" organizar bloques"
											})
										).add(
											$("<p />").append(
												$("<span />",{
													"id"	:	"area-picker-panel-" + panel_area_equipo_nro_unico,
													"area"	:	"area-" + panel_area_nro_unico,
													"class"	:	"area-picker",
													"text"	:	" personalizar color"
												})
											)
										)
									)
								)
							)
						);
			
			$("#area-cont").append(panel);
			
			
		},
		complete: function(){
			
			console.log("consola: esquema - creando esquema - termino de crear esquema");
			
			app_comprueba_esquema(0,0);
			
		},
		error: function(){
			
			console.log("consola: esquema - creando esquema - error durante la creacion");
			
		}
	
	});
	
}

function app_control_ini(control, valor){
	
	var dataString = null;
	var empresas = null;
	var areas = null;
	
	switch(control){
	
		case 1:
			/* SELECCION DE EMPRESAS
			 * ---------------------
			 * */
			
			dataString = {
				con_empresa:0,
				nro_empresa:0
			};
			
			dataString = $.param(dataString);
			
			$.ajax({
				
				type: "POST",
				url: "../../esmeralda-services-maintenance/class/list-esquema/listenerEmpresa.php",
				data: dataString,
				dataType: "json",        
				success: function(data) {
					
					console.log("consola: lista empresas - creando lista empresas");
					
					$.each(data.empresas, function(i, item) {	
						
						empresas = (
							$("<option />",{
								"id"	:	"sele-empresa-" + item.nro_unico,
								"value"	:	item.nro_unico,
								"text"	:	item.descripcion
							})
						);
						/*empresas = empresas + "<option id='sele-empresa-" + item.nro_unico + "' value='" + item.nro_unico + "'>";
						empresas = empresas + item.descripcion;
						empresas = empresas + "</option>";*/										
						$("#sele-empr").append(empresas);
						
					});
					
				},
				complete: function(){
					
					console.log("consola: lista empresas - termino la creacion de lista empresas");
					
				},
				error: function(){
					
					console.log("consola: lista empresas - error durante la creacion de lista empresas");
					
				}
			
			});
			
			break;
		
		case 2:
			/* SELECCION DE AREAS
			 * ------------------
			 * */
			if(valor == 0){
				
				$("#sele-area").empty().append(
					$("<option />",{
						"value"	:	0,
						"text"	:	"Seleccione una empresa"
					})
				);
				
			}else{
				
				dataString = {
					con_area:0,
					nro_area:0,
					nro_empresa:valor
				};
					
				dataString = $.param(dataString);
				
				$.ajax({
					
					type: "POST",
					url: "../../esmeralda-services-maintenance/class/list-esquema/listenerAreaEmpresa.php",
					data: dataString,
					dataType: "json",        
					success: function(data) {
						
						console.log("consola: lista area - creando lista area");
						
						$("#sele-area").empty().append(
							$("<option />",{							
								"value"	:	0,
								"text"	:	"Todas las areas"
							})
						);
						
						$.each(data.areasempresa, function(i, item) {		
							
							areas =	$("<option />",{
										"id"	:	"sele-empresa-" + item.nro_unico,
										"value"	:	item.nro_unico,
										"text"	:	item.nombre_compuesto
									});
							/*areas = areas + "<option id='sele-area-" + item.nro_unico + "' value='" + item.nro_unico + "'>";
							areas = areas + item.nombre_compuesto;
							areas = areas + "</option>";	*/	
							$("#sele-area").append(areas);
							
						});
							
						
											
						
					},
					complete: function(){
					
						console.log("consola: lista area - termino la creacion de lista area");
						
					},
					error: function(){
						
						console.log("consola: lista area - error durante la creacion de lista area");
						
					}
				
				});
				
			}
			
			break;
			
		default:
			
			break;
		
	}
	
}



function app_esquema_ini(){
	
	/* INICIALIZANDO CONTROLES PARA PERSONALIZACION DE COLOR EN PANELES POR AREA
	 * -------------------------------------------------------------------------
	 * */
	$("span[id^='area-picker-panel-']").livequery(function(){
		
		var id_container = $(this).attr("id");
		var id_container_area = $(this).attr("area");		
		
		$(this).ColorPicker({
			
			onChange: function (hsb, hex, rgb) {
				
				$("#"+id_container.substring(12,id_container.length)+"").css("background-color","#"+hex.toString());
				
				/*var idc_tem = id_container.substring(18,id_container.length);*/
				var idc_tem_are = id_container_area.substring(5,id_container.length);
				/*console.log(idc_tem_are);*/
				var usr_cfg_ini_col = "";
				usr_cfg_ini_col = JSON.parse(localStorage.loc_usr_cfg);
				
				$.each(usr_cfg_ini_col.panels,function(i,ubic) {
					
					if(ubic.id == idc_tem_are) {
						
						ubic.color = "#"+hex.toString();
						
					}
					
				});
				
				/* ACTUALIZAR OBJETO EN EL LOCALSTORAGE
				 * */				
				localStorage.loc_usr_cfg = JSON.stringify(usr_cfg_ini_col);
				
			}
		
		});
		
	});
	
	/* INCIALIZANDO EVENTO CLICK PARA EVENTO DRAG DE LOS PANELES
	 * ---------------------------------------------------------
	 * */	
	$('input[id^="chck-posi-"]').live("click", function(){
		
		var id_container = "";
		
		id_container = $(this).attr("id");
		
		id_container = "#" + id_container.substring(10,id_container.length);
		
		console.log(id_container);
		
		if($(this).is(':checked') == true){
			
			var top1 = parseInt($(id_container).position().top);
			var top2 = parseInt($(id_container).css("margin-top"));
			var left1 = parseInt($(id_container).position().left);
			var left2 = parseInt($(id_container).css("margin-left"));
			
			var usr_cfg_ini_dra = JSON.parse(localStorage.loc_usr_cfg);
						
			var idc_tem_dra = 0;
			
			idc_tem_dra = parseInt(id_container.substring(7,id_container.length));
			
			$.each(usr_cfg_ini_dra.panels,function(i,ubic) {
				
				if(ubic.id == idc_tem_dra){
					
					$(id_container).attr("style","background-color: " + ubic.color + "; position:absolute; top:" + (top1 + top2).toString() + "px ; left:" + (left1 + left2).toString() + "px;");
					
				}
				
			});
			
			$(id_container).draggable({
				
				disabled: false,
				containment: "#area-cont",
				scroll: false,
				drag: function(){
											
					/* ACTUALIZANDO VALOR DEL OBJETO JSON PARA CAPTURAR LA POSICION ACTUAL DEL ELEMENTO "DRAGGABLE" 
					 * --------------------------------------------------------------------------------------------
					 * */
					var idc_tem_dra = 0;
					
					idc_tem_dra = parseInt(id_container.substring(7,id_container.length));
					
					usr_cfg_ini_dra = JSON.parse(localStorage.loc_usr_cfg);
					
					$.each(usr_cfg_ini_dra.panels,function(i,ubic) {
						
						if(ubic.id == idc_tem_dra) {						
							
							ubic.position.top = parseInt(($(id_container).position().top + parseInt($(id_container).css("margin-top"))) - $("#area-cont").position().top);
							ubic.position.left = parseInt(($(id_container).position().left + parseInt($(id_container).css("margin-left"))) - $("#area-cont").position().left);
							
						}
						
					});
										
					/* ACTUALIZAR OBJETO EN EL LOCALSTORAGE
					 * */
					localStorage.loc_usr_cfg = JSON.stringify(usr_cfg_ini_dra);
					
				}
			
			});
			
			console.log("true");
			
		}else{

			$(id_container).draggable({
				
				disabled: true
				
			});
			
			var idc_tem = "";
			
			var n_top = 0;
			var n_left = 0;
			
			idc_tem = id_container.substring(7,id_container.length);
			
			n_top = parseInt(($(id_container).position().top + parseInt($(id_container).css("margin-top"))) - $("#area-cont").position().top);
			n_left = parseInt(($(id_container).position().left + parseInt($(id_container).css("margin-left"))) - $("#area-cont").position().left);
			
			var usr_cfg_sav_dra = JSON.parse(localStorage.loc_usr_cfg);
			
			$.each(usr_cfg_sav_dra.panels,function(i,ubic) {
				
				if(ubic.id == idc_tem) {
					console.log(idc_tem);
					ubic.position.top = n_top;
					ubic.position.left = n_left;
					
				}
				
			});
			
			localStorage.loc_usr_cfg = JSON.stringify(usr_cfg_sav_dra);
					
			/* localStorage.posicion_top = parseInt(($(id_container).position().top + parseInt($(id_container).css("margin-top"))) - $("#area-cont").position().top);
			 * localStorage.posicion_left = parseInt(($(id_container).position().left + parseInt($(id_container).css("margin-left"))) - $("#area-cont").position().left);
			 * */
			
			/* ACTUALIZAR OBJETO EN EL LOCALSTORAGE
			 * ------------------------------------
			 * */
			
			console.log("false");
			
		}
	
	});
	
}

function app_tool_find_object(objeto,atributo,abuscar){
	
	$.each(objeto,function(x,pos) {
		
		if(pos.abuscar == abuscar){
			
			return objeto.abuscar;
			
		}
		
	});
	
}

